<form class="page-wrap" method="post" action="./doc/json/ajaxDone.json" onsubmit="return validateCallback(this, navViewAjaxDoneClose)">

	<header>
		<div class="toolbar">
			<a class="bar-button back-button"><i class="icon icon-back"></i></a>
			<div class="header-title">
				<div class="title">表单提交 + 验证</div>
			</div>
		</div>
	</header>

	<div class="content">

		<div class="scroll-content dwz-scroll">
			<div class="scroll">

				<div class="pageFormContent unitBox">

					<div class="form-item">
						<div class="item-content">
							<label>省市区</label>
							<input type="hidden" name="province">
							<input type="hidden" name="city">
							<input type="hidden" name="county">
							<input type="text" name="destination" class="required" placeholder="省、市、区" data-error="请选择省市区" readonly onclick="$.dialog.open({
									url: 'tpl/helper/dialogSelectRegion.html?dwz_callback=biz.helper.selectRegionRender',
									data: {target:this, code: '',
										callback: function(data) {
											console.log(this, data)
											var form = this.parentsByTag('form').get(0);
											form.province.value = data.province;
											form.city.value = data.city;
											form.county.value = data.county;
											form.destination.value = data.names;
											
											$.dialog.close();
										}
									},
									pop: 'actionSheet'
								})">
							<i class="arrow-right"></i>
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>兴趣爱好</label>
							<input type="hidden" name="interest_id">
							<input type="text" name="interest_id_txt" placeholder="请选择兴趣爱好" class="required" data-error="请选择兴趣爱好" readonly onclick="$.alert.prompt('tpl/helper/multipleSelect.html?dwz_callback=biz.helper.multipleSelectRender', {
								target: this,
								page_title: '选择兴趣爱好',
								list: InterestStore.data,
								callback: function(data) {
									console.log(this, data)
									var form = this.parentsByTag('form').get(0);

									form.interest_id.value = data.map(function(item){
										return item.value
									}).join(',');

									form.interest_id_txt.value = data.map(function(item){
										return item.name
									}).join(',')
								}
							})">
							<i class="arrow-right"></i>
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>交通工具</label>
							<select name="traffic_vehicle" class="required" data-error="请选择交通工具">
								<option value="">请选择</option>
								<option value="1">飞机</option>
								<option value="2">火车</option>
								<option value="3">汽车</option>
								<option value="4">其它</option>
							</select>
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>日期</label>
							<input type="date" name="start_date" value="" placeholder="请选择（必填）" class="required" data-error="请选择日期">
						</div>
					</div>
					<div class="form-item">
						<div class="item-content">
							<label>手机号</label>
							<input type="tel" name="mobile" value="" class="required dwz-clipboard" placeholder="11位手机号" maxlength="11" pattern="[0-9]{11,11}" data-error="请输入11位手机号">
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>身份证</label>
							<input type="tel" name="id_code" value="" class="required dwz-clipboard" placeholder="18位身份证号" maxlength="18" pattern="[0-9]{17,17}[0-9A-Z]{1,1}" data-error="请输入18位身份证号">
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>整数范围</label>
							<input type="number" step="1" name="number1" placeholder="1~10之间的整数" class="required" min="1" max="10" data-error="请输入1~10之间的整数">
						</div>
					</div>

					<div class="form-item">
						<div class="item-content">
							<label>小数范围</label>
							<input type="number" step="0.01" name="number1" placeholder="1~10之间的小数" class="required" min="1" max="10" data-error="请输入1~10之间的小数">
						</div>
					</div>

					<div class="form-item">
						<label>备注</label>
						<div class="item-content">
							<textarea class="textarea required" name="info" rows="4" placeholder="请输入备注（必填）" maxlength="200" data-error="请输入备注"></textarea>
						</div>
					</div>

				</div>

			</div>
		</div>

	</div>

	<div class="form-bar">
		<button class="button primary" type="submit">提交</button>
	</div>
</form>